<!doctype html><html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Bootstrap柱状图插件</title> <link rel="stylesheet" href="http://libs.useso.com/js/bootstrap/3.2.0/css/bootstrap.min.css"> <link rel="stylesheet" href="css/main.css"> <!--[if IE]> <script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script> <![endif]--> </head> <body> <article class="sucaihuo-container"> <div class="container"> <p>鼠标移动上去可看到对应值</p> <hr> <div id="population_chart" data-sort="false" data-width="800" class="jChart chart-lg" name="素材火日ip访问统计"> <div class="define-chart-row" data-color="#84d6ff" title="网页特效">500000</div> <div class="define-chart-row" data-color="#38BCFF" title="网站模板">217500</div> <div class="define-chart-row" data-color="#00A9FF" title="网站源码">119000</div> <div class="define-chart-row" data-color="#008DD3" title="PHP">78000</div> <div class="define-chart-row" data-color="#0074AA" title="在线工具">466000</div> <div class="define-chart-row" data-color="#005882" title="精选网址">326000</div> <div class="define-chart-footer">100000</div> <div class="define-chart-footer">200000</div> <div class="define-chart-footer">300000</div> <div class="define-chart-footer">400000</div> <div class="define-chart-footer">500000</div> </div> <div id="colors_chart" data-sort="true" data-x_label="% of Total Love of Pies" data-width="300" class="chart-sm" name="访问地区"> <div class="define-chart-row" data-color="#ffb600" title="江苏">13</div> <div class="define-chart-row" data-color="#966510" title="广东">24</div> <div class="define-chart-row" data-color="#cc0000" title="山东">17</div> <div class="define-chart-row" data-color="#59e000" title="山西">26</div> <div class="define-chart-row" data-color="#990077" title="浙江">12</div> <div class="define-chart-row" data-color="#603000" title="海外">8</div> <div class="define-chart-footer">10</div> <div class="define-chart-footer">20</div> <div class="define-chart-footer">30</div> </div> </div> </article> <script src="http://libs.useso.com/js/jquery/2.1.1/jquery.min.js" type="text/javascript"></script> <script>window.jQuery || document.write('<script src="js/jquery-2.1.1.min.js"><\/script>')</script> <script src="http://libs.useso.com/js/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="js/jchart.js"></script> <script> $(document).ready(function() { $("#population_chart").jChart({x_label: "统计图标题"}); $("#colors_chart").jChart(); }); </script> <script type="text/javascript" src="http://shouce.ren/static/ad/gg.js"></script></body></html>
评论